const coverWorker = new Worker('work.cover.js', {name: 'cover'});
const messageWorker = new Worker('work.message.js', {name: 'message'});
const messageTopicElem = document.querySelector('.J_MessageTopic');
const coverViewElem = document.querySelector('.J_CoverView');
const coverImgElem = coverViewElem.querySelector('.J_CoverImg');

// 高斯模糊
var coverImg = new Image();
coverImg.onload = () => {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    const originImageWidth = coverImg.width;
    const originImageHeight = coverImg.height;
    canvas.setAttribute('width', originImageWidth);
    canvas.setAttribute('height', originImageHeight);
    ctx.drawImage(coverImg, 0, 0, originImageWidth, originImageHeight);
    const imageData = ctx.getImageData(0, 0, originImageWidth, originImageHeight);
    coverWorker.addEventListener('message', ({data}) => {
        const gaussData = data.gaussData;
        ctx.putImageData(gaussData, 0, 0);
        const iamgeURLData = canvas.toDataURL('image/jpeg');
        coverViewElem.style.backgroundImage = `url(${iamgeURLData})`;
        // 断开连接，终止其内所有执行
        coverWorker.terminate();
    });
    coverWorker.postMessage({operate: 'cover', imageData});
}
coverImg.src = coverImgElem.getAttribute('src');

// 未读消息：2秒轮询
messageWorker.addEventListener('message', ({data}) => {
    const unReadNumber = data.number;
    const unReadTopic = data.message;
    messageTopicElem.innerText = `消息提醒：${unReadTopic}`;
    // console.log(unReadNumber, unReadTopic);
    setTimeout(fetchUnreadMessage, 1000); // 2秒 后调用发送请求
});
function fetchUnreadMessage(){
    messageWorker.postMessage({operate: 'fetch'});
}
fetchUnreadMessage();

// worker.postMessage({message: "更新消息队列", type: "update-message"}) // 发送文本消息                                                                                                                                                                     
// // 接收worker线程向主线程发送的消息                                                                                                                                                                                               
// worker.onmessage = event => {
//     console.log(event.data);
// };
// worker.addEventListener('message', event => {                                                                                                                                                                                     
//   console.log(event.data);
// });
// // 当发送的消息序列化失败时触发该事件。                                                                                                                                                                                           
// worker.onmessageerror = error => console.error(error)                                                                                                                                                                             
// // 捕获Worker线程发生的异常                                                                                                                                                                                                       
// worker.onerror = error => {                                                                                                                                                                                                       
//   console.error(error)                                                                                                                                                                                                          
// }
// 关闭worker线程                                                                                                                                                                                                                 
// worker.terminate();
